<!doctype html>
<html lang="en">

<head>
	<meta charset="utf-8">
	<meta http-equiv="x-ua-compatible" content="ie=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="fragment" content="!">
	<link rel="stylesheet" href="dist/main.css">
	<title>Bootstrap Magic : Generate your own Bootstrap themes quickly and easily</title>
	<link rel="shortcut icon" href="bootstrap-magic.ico" type="image/x-icon">
	<meta name="description" content="Bootstrap themes generator help you customize your Bootstrap 4.0 theme in minutes. Design your own bootstrap themes, like it ? Download less or css on the go."
	/>
	<meta property="og:type" content="website">
	<meta property="og:url" content="https://pikock.github.io/bootstrap-magic/">
	<meta property="og:title" content="Bootstrap Magic 4: Generate your own Bootstrap 4.0 theme in minutes">
	<meta property="og:image" content="https://pikock.github.io/bootstrap-magic/app/img/bootstrap-social.jpg">
	<meta property="og:description" content="Bootstrap themes generator help you customize your Bootstrap 4.0 theme in minutes. Design your own bootstrap themes, like it ? Download less or css on the go.">
	<meta property="og:site_name" content="Bootstrap Magic">
	<meta property="og:locale" content="en_US">
	<meta name="twitter:url" content="https://pikock.github.io/bootstrap-magic/">
	<meta name="twitter:title" content="Bootstrap Magic 4: Generate your own Bootstrap 4.0 theme in minutes">
	<meta name="twitter:description" content="Bootstrap themes generator help you customize your Bootstrap 4.0 theme in minutes. Design your own bootstrap themes, like it ? Download less or css on the go. #bootstrap">
	<meta name="twitter:image" content="https://pikock.github.io/bootstrap-magic/app/img/bootstrap-social.jpg">
</head>

<body data-ng-cloak>
	<div id="orson-alert" class="protected alert text-center alert-light">
		<span class="">Create beautiful websites in minutes with Orson Website Builder 🔒 Free HTTPS included !    <a class="fancy-button" href="https://en.orson.io/17/build-responsive-website-without-coding" title="Create responsive design website without coding"  style="box-shadow: none"> Try for free</a></span>
		<button type="button" id="orson-alert-close" class="close" data-dismiss="alert" aria-label="Close">
	    <span aria-hidden="true">&times;</span>
	  </button>
	</div>
	<header class="protected">
		<nav class="navbar navbar-expand-lg navbar-dark bg-indigo">
			<a class="navbar-brand" href="/" title="Bootstrap magic logo create theme with Bootstrap 4.0">
				<img src="./app/img/logo-boostrapmagic.svg" width="22.6" height="22.8" alt="logo">
			</a>
			<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarColor01" aria-controls="navbarColor01"
			 aria-expanded="false" aria-label="Toggle navigation">
				<span class="navbar-toggler-icon"></span>
			</button>

			<div class="collapse navbar-collapse" id="navbarColor01">
				<ul class="navbar-nav mr-auto">
					<li class="nav-item">
						<a class="nav-link" href="./app/index.html" title="Create your theme with Bootstrap 4.0">Editor
						</a>
					</li>
					<li class="nav-item dropdown">
						<a class="nav-link dropdown-toggle" href="#" id="verionsLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
							Old versions
						</a>
						<div class="dropdown-menu" aria-labelledby="verionsLink">
							<a class="dropdown-item" href="./3.1">3.1</a>
							<a class="dropdown-item" href="./3.0">3.0</a>
							<a class="dropdown-item" href="./2.3.2">2.3.2</a>
						</div>
					</li>
					<li class="nav-item">
						<a class="nav-link" href="https://en.orson.io/17/build-responsive-website-without-coding" title="Create responsive design website without coding">Orson Website builder</a>
					</li>
				</ul>

				<span class="navbar-text rs">
					<a href="https://twitter.com/home?status=Bootstrap%20Magic%204.0%20%3A%20Generate%20your%20own%20%23Bootstrap%204.0%20theme%20quickly%20and%20easily%20in%20the%20browser.%20%23bootstrapmagic%20%23angularjs%20https%3A//pikock.github.io/bootstrap-magic/"
					/>
					<img src="./app/img/twitter-icn.svg" width="50" height="50" alt="">
					</a>
					<a href="https://www.facebook.com/sharer/sharer.php?u=https%3A//pikock.github.io/bootstrap-magic/">
						<img src="./app/img/fb-icn.svg" width="50" height="50" alt="">
					</a>
					<a href="https://plus.google.com/share?url=https%3A//pikock.github.io/bootstrap-magic/">
						<img src="./app/img/g-icn.svg" width="50" height="50" alt="">
					</a>
				</span>
			</div>
		</nav>
	</header>

	<div class="protected content bg-indigo">
		<div class="container text-center no-reveal">
			<div class="alert"><a href="https://en.orson.io/17/build-responsive-website-without-coding" title="build your website without coding" target="_blank">Create your website without coding</a> with Orson.io. For French user: vous pouvez <a href="https://fr.orson.io/" title="Création de site internet professionnel" target="_blank">créer un site internet sans coder.</a></div>
			<div class='box'>
				<div class='wave -one'></div>
				<div class='wave -two'></div>
				<div class='wave -three'></div>
			</div>

			<h1>Bootstrap Magic 4.0</h1>
			<h3>Create your Bootstrap 4.0 themes easily.</h3>
			<p>Live preview, live HTML coding to help you create your Bootstrap 4.0 theme direclty in your browser</p>

			<a href="./app/index.html" title="Create your Bootstrap themes in minutes" class="fancy-button is-big">Create your theme</a>

			<p>
				<img src="./app/img/icn-github.svg" alt="" width="25" style="margin-top: -3px;">
				<a href="https://github.com/pikock/bootstrap-magic" class="">Github project</a>
			</p>
		</div>

		<div class="container text-center">
			<div class="logo-header long-reveal" src="./app/img/screen-hero.svg" alt="hero">
				<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="820" height="461
				" viewBox="0 0 820 461">
					<defs>
						<rect id="b" width="56.4" height="19.2" x=".4" y=".2" rx="2.4" />
						<filter id="a" width="130.1%" height="188.5%" x="-15.1%" y="-33.9%" filterUnits="objectBoundingBox">
							<feOffset dy="2" in="SourceAlpha" result="shadowOffsetOuter1" />
							<feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1" stdDeviation="2.5" />
							<feColorMatrix in="shadowBlurOuter1" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0" />
						</filter>
						<rect id="d" width="219.84" height="284.16" rx="1.92" />
						<filter id="c" width="124.1%" height="118.7%" x="-12.1%" y="-8.6%" filterUnits="objectBoundingBox">
							<feOffset dy="2" in="SourceAlpha" result="shadowOffsetOuter1" />
							<feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1" stdDeviation="8.5" />
							<feComposite in="shadowBlurOuter1" in2="SourceAlpha" operator="out" result="shadowBlurOuter1" />
							<feColorMatrix in="shadowBlurOuter1" values="0 0 0 0 0.0660734589 0 0 0 0 0.236553997 0 0 0 0 0.223372512 0 0 0
				 1 0" />
						</filter>
						<rect id="e" width="183.36" height="38.4" y="26.88" />
						<rect id="f" width="144" height="38.4" y="26.88" />
						<rect id="g" width="172.8" height="38.4" y="26.88" />
					</defs>
					<g fill="none" fill-rule="evenodd" transform="translate(33 10)">
						<rect width="666" height="442" x="108" fill="#0F1023" stroke="#2C354F" stroke-width="1.2" rx="2.4" />
						<rect width="664" height="218" x="109" y="1" fill="#222339" />
						<path fill="#10111E" d="M112.4,1 L770.6,1 L770.6,1 C771.925483,1 773,2.0745166 773,3.4 L773,27 L110,27 L110,3.4
				 L110,3.4 C110,2.0745166 111.074517,1 112.4,1 Z" />
						<rect width="32" height="5" x="128" y="12" fill="#444563" rx="2.4" />
						<rect width="32" height="5" x="168" y="12" fill="#444563" rx="2.4" />
						<rect width="32" height="5" x="208" y="12" fill="#444563" rx="2.4" />
						<g fill="#18192F" fill-rule="nonzero" transform="translate(215 54)">
							<path d="M511.477855,19.0932836 C503.641057,12.3022388 487.967459,12.3022388 480.13066,19.0932836 L343,106.5 C340.937685,108.129851
				 337.63798,108.129851 335.575664,106.771642 L225.934732,43.5 C217.68547,37.5238806 203.249262,37.5238806 195,43.5 L7,132
				 C2.87536908,134.98806 0.400590521,138.791045 0.400590521,142.865672 L0.600885781,158.480597 C0.600885781,162.01194 5.1379798,165
				 10.5,165 L555,165 C561.009465,165 558.911111,164.127801 558.911111,158.717164 L558.911111,63.9141791 C558.911111,60.3828358
				 557.261259,56.8514925 553.549091,53.8634328 L511.477855,19.0932836 Z" />
							<ellipse cx="87.531" cy="14.5" rx="14.531" ry="14.5" />
						</g>
						<g transform="translate(253 239)">
							<rect width="157" height="137.301" fill="#23253C" />
							<g transform="translate(177)">
								<g transform="translate(0 120)">
									<use fill="black" filter="url(#a)" xlink:href="#b" />
									<use fill="#B60958" xlink:href="#b" />
									<text fill="#FFFFFF" font-family="OpenSans-Semibold, Open Sans" font-size="10" font-weight="500
				" letter-spacing="-.15">
										<tspan x="13" y="13">Morbi </tspan>
									</text>
								</g>
								<text fill="#8082A0" font-family="OpenSans-Bold, Open Sans" font-size="15" font-weight="bold
				" letter-spacing="-.15">
									<tspan x="0" y="16">Phasellus arcu</tspan>
								</text>
								<text fill="#8082A0" font-family="OpenSans-Semibold, Open Sans" font-size="10" font-weight="500
				" letter-spacing="-.15">
									<tspan x="0" y="41">Morbi molestie justo et finibus auctor. </tspan>
									<tspan x="0" y="55">Nunc accumsan leo vel metus sollicitudin </tspan>
									<tspan x="0" y="69">dapibus. Praesent rutrum nibh tincidunt </tspan>
									<tspan x="0" y="83">sagittis mattis.</tspan>
								</text>
							</g>
							<path fill="#18192F" fill-rule="nonzero" d="M128.5,49 C126.298967,44.6635497 121.896901,44.6635497 119.695868,49
				 C90.9514356,88.24486 76.3861461,107.578193 76,107 L52,72.5 C49.6831232,68.6839238 45.6285889,68.6839238 43.3117121,72.5
				 C14.5122436,105.917071 0.112509323,123.492897 0.112509323,125.227477 L0.168763985,135.198454 C0.168763985,137.453408
				 -0.505969896,139.5 1,139.5 L156,139.5 C157.50597,139.5 156.975035,137.604469 156.975035,135.349514 L157,88.8800845 C157,86.6251304
				 156.536625,84.3701762 155.49403,82.4621381 L128.5,49 Z" />
							<circle cx="29.503" cy="43" r="9" fill="#18192F" fill-rule="nonzero" />
							<g transform="translate(0 162)">
								<rect width="157" height="40" fill="#23253C" />
								<g fill="#8082A0" letter-spacing="-.15" transform="translate(176)">
									<text font-family="OpenSans-Bold, Open Sans" font-size="15" font-weight="bold">
										<tspan x="1" y="16">Metus sollicitudin</tspan>
									</text>
									<text font-family="OpenSans-Semibold, Open Sans" font-size="10" font-weight="500">
										<tspan x="0" y="37">Morbi molestie justo et finibus auctor. </tspan>
									</text>
								</g>
							</g>
						</g>
						<g transform="translate(0 77)">
							<use fill="black" filter="url(#c)" xlink:href="#d" />
							<use fill="#0F1023" xlink:href="#d" />
							<rect width="218.88" height="283.2" x=".48" y=".48" stroke="#11D3C4" stroke-width=".96" rx="1.92" />
							<g transform="translate(18.24 24.96)">
								<text fill="#FFFFFF" font-family="Amiko-Regular, Amiko" font-size="13.44" letter-spacing=".016">
									<tspan x="0" y="15">@font-family</tspan>
								</text>
								<use fill="#030413" xlink:href="#e" />
								<rect width="182.76" height="37.8" x=".3" y="27.18" stroke="#E6E6E6" stroke-width=".6" />
								<text fill="#FFFFFF" font-family="OpenSans, Open Sans" font-size="13.44" letter-spacing=".016">
									<tspan x="9.6" y="50.48">Open sans</tspan>
								</text>
								<g transform="translate(0 84.48)">
									<text fill="#FFFFFF" font-family="Amiko-Regular, Amiko" font-size="13.44" letter-spacing=".016">
										<tspan x="0" y="15">@brand-primary</tspan>
									</text>
									<use fill="#030413" xlink:href="#f" />
									<rect width="143.4" height="37.8" x=".3" y="27.18" stroke="#E6E6E6" stroke-width=".6" />
									<text fill="#FFFFFF" font-family="OpenSans, Open Sans" font-size="13.44" letter-spacing=".016">
										<tspan x="9.6" y="50.48">#B60958</tspan>
									</text>
									<circle cx="167.52" cy="45.6" r="12.96" fill="#B60958" />
								</g>
								<g transform="translate(0 168.96)">
									<text fill="#FFFFFF" font-family="Amiko-Regular, Amiko" font-size="13.44" letter-spacing=".016">
										<tspan x="0" y="15">@btn-info-border</tspan>
									</text>
									<use fill="#030413" xlink:href="#g" />
									<rect width="172.2" height="37.8" x=".3" y="27.18" stroke="#E6E6E6" stroke-width=".6" />
									<text fill="#FFFFFF" font-family="OpenSans, Open Sans" font-size="13.44" letter-spacing=".016">
										<tspan x="9.6" y="50.48">darken(@btn-info-bg, 5%)</tspan>
									</text>
								</g>
							</g>
						</g>
					</g>
				</svg>
			</div>
		</div>

		<div class="container text-center is-big">
			<h1>What's great</h1>

			<div class="container-fluid">
				<div class="row pt-2 to-reveal">
					<div class="col-lg mt-3">
						<div class="card">
							<img class="card-img-top" src="./app/img/icn-01-bootstrapmagic.svg" width="50" height="36" alt="Bootstrap 4.0 Theme generator">
							<div class="card-body">
								<h4 class="card-title">Bootstrap 4.0</h4>
								<p class="card-text">Includes the latest and greatest, Bootstrap 4.0, for fresh and up-to-date templates.</p>
							</div>
						</div>
					</div>
					<div class="col-lg mt-3">
						<div class="card">
							<img class="card-img-top" src="./app/img/icn-02-bootstrapmagic.svg" width="50" height="36" alt="SASS Bootstrap themes generator">
							<div class="card-body">
								<h4 class="card-title">Sass included </h4>
								<p class="card-text">Bootstrap Magic leverages Sass’s power to make all helper functions available to you. Darken, ligthen and the mixins
									goodness are just one click way.</p>
							</div>
						</div>
					</div>
					<div class="col-lg mt-3">
						<div class="card">
							<img class="card-img-top" src="./app/img/icn-03-bootstrapmagic.svg" width="50" height="36" alt="Colopicker to select your color">
							<div class="card-body">
								<h4 class="card-title">Color Picker</h4>
								<p class="card-text">For each color variable, you can either go with the Color Picker or use your hex/rgba codes directly. </p>
							</div>
						</div>
					</div>
					<div class="col-lg mt-3">
						<div class="card">
							<img class="card-img-top" src="./app/img/icn-04-bootstrapmagic.svg" width="50" height="36" alt="HTML Code preview">
							<div class="card-body">
								<h4 class="card-title">HTML code preview</h4>
								<p class="card-text">You can now insert your own HTML and CSS and get a live preview with your freshly created Bootstrap theme.
								</p>
							</div>
						</div>
					</div>
				</div>
				<div class="row to-reveal">
					<div class="col-lg mt-4">
						<div class="card">
							<img class="card-img-top" src="./app/img/icn-05-bootstrapmagic.svg" width="50" height="36" alt="Magic Typehead Bootstrap variables">
							<div class="card-body">
								<h4 class="card-title">Magic Variables Typeahead</h4>
								<p class="card-text">Find all Bootstrap variables as you type to create links between variables.</p>
							</div>
						</div>
					</div>
					<div class="col-lg mt-4">
						<div class="card">
							<img class="card-img-top" src="./app/img/icn-06-bootstrapmagic.svg" width="50" height="36" alt="Google font for custom design">
							<div class="card-body">
								<h4 class="card-title">Google Fonts</h4>
								<p class="card-text">Create your template with all Google Fonts. They are all included in font magic Typeahead. Simple.</p>
							</div>
						</div>
					</div>
					<div class="col-lg mt-4">
						<div class="card">
							<img class="card-img-top" src="./app/img/icn-07-bootstrapmagic.svg" width="50" height="36" alt="SCSS and CSS download">
							<div class="card-body">
								<h4 class="card-title">Download in CSS/SCSS</h4>
								<p class="card-text">Happy about your template ? Download your full CSS stylesheet or your SCSS variables.</p>
							</div>
						</div>
					</div>
					<div class="col-lg mt-4">
						<div class="card">
							<img class="card-img-top" src="./app/img/icn-01-bootstrapmagic.svg" width="50" height="36" alt="Open Source project MIT Licence">
							<div class="card-body">
								<h4 class="card-title">Open Source Project</h4>
								<p class="card-text">Bootstrap Magic is all Open Source and free with the MIT License. Can be reused as you want.</p>
							</div>
						</div>
					</div>
				</div>
			</div>

		</div>

		<div class="container is-big section-cta to-reveal">
			<div class="container-fluid fancy-border">
				<div class="row">
					<div class="col-lg-4 block-cta align-middle">
						<h3>Customize your Bootstrap Themes!</h3>
						<p>Start using our Bootstrap Magic generator and create your own theme in minutes</p>
						<a href="./app/index.html" class="fancy-button" title="Create bootstrap themes">Create your theme</a>
					</div>
					<div class="col-lg-8">
						<img class="logo-header" src="./app/img/screen-hero-02.svg" alt="Responsive design bootstap theme">
					</div>
				</div>
			</div>
		</div>

		<div class="container text-center is-big newsletter-cta">
			<h1>Discover our other great projects</h1>
			<p>At
				<a href="http://en.orson.io" title="Create your website without coding">Orson.io</a>,we love to craft and design products that make website creation easier.</p>
		</div>

		<!-- 	<div class="container text-center is-big newsletter">
			<img src="./app/img/paper-plane.svg" class="paper-plane to-reveal">
			<div class="row justify-content-md-center">
				<div class="col-sm-12 col-md-8 col-lg-8">
					<form class="form-inline">
						<div class="form-group mx-sm-3">
							<label for="email" class="sr-only">Email</label>
							<input type="text" class="form-control" id="email" placeholder="email">
						</div>
						<button type="submit" class="fancy-button is-small ">Ok</button>
					</form>
				</div>
			</div>
		</div> -->


		<div class="container is-big section-cta to-reveal mashup-template">
			<div class="container-fluid fancy-border">
				<div class="row">
					<div class="col-lg-4 block-cta align-middle">
						<h3>
							<a href="http://mashup-template.com/" title="Free html5 templates">
								<img class="logo logo-mashup" src="./app/img/hero-mashup-template-logo.svg" alt="Free html template">
							</a>
						</h3>
						<p>Free Beautiful HTML5/CSS3 Templates based on pre-built Blocks to create a website in minutes. All Mashup Templates
							are responsive design, fully customisable and can be used for any purpose</p>
						<a href="http://mashup-template.com/" class="fancy-button" title="Create website free html templates">Create your website for free</a>
					</div>
					<div class="col-lg-8">
						<img class="logo-header" src="./app/img/screen-hero-mashup-template.png" alt="Mashup free responsive design templates">
					</div>
				</div>
			</div>
		</div>

		<div class="container is-big section-cta to-reveal orson">
			<div class="container-fluid fancy-border">
				<div class="row">
					<div class="col-lg-4 block-cta align-middle">
						<h3>
							<a href="https://en.orson.io/17/build-responsive-website-without-coding" title="Build responsive design website without coding">
								<img class="logo logo-orson" alt="Orson responsive website builder logo" src="./app/img/hero-orson-logo.svg" width="220">
							</a>
						</h3>
						<p>
							<strong>Build beautiful and responsive design websites without coding.</strong> Everything you need to build your online presence
							is included in Orson.io. </p>
						<a href="https://en.orson.io/17/build-responsive-website-without-coding" title="Create your website without coding" class="fancy-button">Try for free</a>
					</div>
					<div class="col-lg-8">
						<img class="logo-header" src="./app/img/screen-hero-orson.png" alt="Responsive design website builder">
					</div>
				</div>
			</div>
		</div>



	</div>


	<footer class="protected container-fluid is-big bg-indigo text-center">
		<div class="row justify-content-md-center pb-3">
			<div class="col-lg-6">
				<img class="logo-header to-reveal" src="./app/img/logo-boostrapmagic.svg" title="Bootstrap themes generator logo" width="72.8"
				 height="73.2" alt="">
				<h1>Bootstrap Magic</h1>
				<h5> Spread
					<span class="is-green">#bootstrapmagic</span>
					love to your friends ! </h5>
			</div>
		</div>

		<div class="row justify-content-md-center pt-3 pb-3">
			<div class="row col-md-5 col-lg-5 justify-content-md-center rs">
				<div class="col-xl-2 col-lg-3 col-md-4">
					<a href="https://twitter.com/home?status=Bootstrap%20Magic%204.0%20%3A%20Generate%20your%20own%20%23Bootstrap%204.0%20theme%20quickly%20and%20easily%20in%20the%20browser.%20%23bootstrapmagic%20%23angularjs%20https%3A//pikock.github.io/bootstrap-magic/">
						<img src="./app/img/twitter-icn.svg" width="80" height="80" alt="">
					</a>
				</div>
				<div class="col-xl-2 col-lg-3 col-md-4">
					<a href="https://www.facebook.com/sharer/sharer.php?u=https%3A//pikock.github.io/bootstrap-magic/">
						<img src="./app/img/fb-icn.svg" width="80" height="80" alt="">
					</a>
				</div>
				<div class="col-xl-2 col-lg-3 col-md-4">
					<a data-size="medium" href="https://plus.google.com/share?url=https%3A//pikock.github.io/bootstrap-magic/">
						<img src="./app/img/g-icn.svg" width="80" height="80" alt="">
						</adiv>
				</div>
			</div>
		</div>
		<div class="row justify-content-md-center pt-3 pb-3">
			<div class="col-md-8 justify-content-md-center">
				<p>
					Crafted with
					<span class="is-green">
						<3</span> and 🍕 in Paris by
							<a href="https://en.orson.io/17/build-responsive-website-without-coding" class="is-green">Orson Website Builder</span>
				</p>
			</div>
		</div>
		</div>
	</footer>

	<div id="fb-root"></div>
	<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
	<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
	 crossorigin="anonymous"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4"
	 crossorigin="anonymous"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1"
	 crossorigin="anonymous"></script>
	<script src="https://unpkg.com/scrollreveal/dist/scrollreveal.min.js">

	</script>
	<script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js"></script>
	<script type="text/javascript">

		setTimeout(function() {
			$('body').addClass('active');
			$('#orson-alert').addClass('active');

			$('#orson-alert-close').click(function(){
				$('body').removeClass('active');
			})
		}, 5000);

		ScrollReveal({ reset: false }).reveal('.quick-reveal', { duration: 300 }).reveal('.to-reveal', { duration: 700 }).reveal('.long-reveal', { duration: 1000 });
		var _gaq = _gaq || [];
		_gaq.push(['_setAccount', 'UA-37710723-1']);
		_gaq.push(['_trackPageview']);

		(function () {
			var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
			ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
			var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
		})();
	</script>
	<script type="text/javascript">
		(function (d, s, id) {
			var js, fjs = d.getElementsByTagName(s)[0];
			if (d.getElementById(id)) return;
			js = d.createElement(s); js.id = id;
			js.src = "//connect.facebook.net/fr_FR/all.js#xfbml=1&appId=239545502808545";
			fjs.parentNode.insertBefore(js, fjs);
		}(document, 'script', 'facebook-jssdk'));

		window.___gcfg = { lang: 'fr' };

		(function () {
			var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
			po.src = 'https://apis.google.com/js/plusone.js';
			var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
		})();

		!function (d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (!d.getElementById(id)) { js = d.createElement(s); js.id = id; js.src = "https://platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs); } }(document, "script", "twitter-wjs");
	</script>
	<script type="text/javascript">
		/* <![CDATA[ */
		var google_conversion_id = 977336662;
		var google_custom_params = window.google_tag_params;
		var google_remarketing_only = true;
/* ]]> */
	</script>

	<noscript>
		<div style="display:inline;">
			<img height="1" width="1" style="border-style:none;" alt="" src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/977336662/?value=0&amp;guid=ON&amp;script=0"
			/>
		</div>
	</noscript>
</body>

</html>